{% extends "sidebar.html" %}

{% block jsfuncs %}


del_link = function(link_id) {

	var log = $('load_img').setStyles({'display':'inline'});
	
	var req = new Request.HTML({ 	url: '/admin/sidebar/links/del',
	 									  	method: 'post',
										  	evalScripts : true,
										  	data: 'id=' + link_id,
											onComplete: function(e) {
												log.setStyles({'display':'none'});
											}
										}).send();

	return false;
	
};

new_link = function (link_id,link_url,link_name) {
	
	var el = new Element('tr', {'id': link_id});
	var td_del_link = new Element('td', {'class': 'del td_button'}).injectInside(el);
	var a_del_link = new Element('a', {
				'events': {
							'click': function(){
 									del_link(link_id);
									}
							},
				'href': '#'
				}).set('text','删除').injectInside(td_del_link);
	
	var td_nom = new Element('td', {'class': 'link_name'}).set('text', link_name).injectAfter(td_del_link);
	var td_nom = new Element('td', {'class': 'link_url'}).set('text',link_url).injectAfter(td_del_link);


	$('link_table').adopt(el);
		
};

$('link_form').addEvent('submit', function(e) {
	new Event(e).stop();
	var log = $('load_img').setStyles({'display':'inline'});
   
	this.set('send',{
		evalScripts: true,
		method: 'post',
		onComplete: function() {
			log.setStyles({'display':'none'});
		}
	});
   this.send();
});

{% endblock %}

{% block content %}
<h3>链接列表</h3>
<div id="link_list">
<table id="link_table">
{% if links.count %}


	{% for link in links %}
		<tr id="{{link.key}}">
			<td class="td_button"><a href="#" onclick="javascript:del_link('{{link.key }}');" class="del_link">删除</a></td>	
			<td class="link_name">{{ link.name }}</td>
			<td class="link_url">{{ link.link }}</td>
		</tr>
	{% endfor %}

{%else%}
	<h4>没有任何链接！</h4>
{% endif %}
</table>
</div>
<div>

<h3>新建链接</h3>
<form action="/admin/sidebar/links/new" method="post" id="link_form">
	<table id="new_link">
		{{ form }}
	<tr><th><input type="submit" value="New"></th><td><img src="/static/images/loading.gif" style="display:none;" id="load_img" /></td></tr>
	</table>	

</form>
</div>

{% endblock %}